<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layout :: common_header(~{::title})">
    <title>商品分类管理 -- 电商ERP系统</title>
</head>
<body th:replace="layout :: common_body(~{::div.layui-body})">
<div class="layui-body" style="padding:15px;top: 0px;">
    <!-- start sp-wrapper -->
    <link rel="stylesheet" href="/sb/stock.css"/>
    <div class="layui-tab layui-tab-brief" lay-filter="demo">
        <ul class="layui-tab-title">
            <ul class="layui-tab-title">
                <!-- <li><a th:href="@{/shop/goods_list}">网店商品管理</a></li> -->
                <li><a href="/goods/list">ERP商品查询</a></li>
                <li><a class="order-item" href="/goods/spec_list">商品规格查询</a></li>
                <li class="layui-this"><a href="/goods/category_list">商品分类管理</a></li>
                <li><a href="/goods/info_list_for_supplier">供应商商品库</a></li>
            </ul>
        </ul>
    </div>
    <div class="sp-wrapper">
        <!-- <h2 class="sp-title"><span>分类管理</span></h2> -->
        
        <dl class="sp-category">
            <dt class="title"><span></span></dt>
            <dd th:each="parent:${categoryList}">
                <div style="background-color: #eb7350">
                <b th:text="${parent.getEntity().getId()}"></b>
                <b th:text="${parent.getEntity().getName()}">分类名</b>
                <span>
                    <i class="add" th:attr="data-id=${parent.getEntity().id},data-text=${parent.getEntity().name},data-parent-id=0">新增二级子类</i>
                </span>
                </div>
                <ul th:unless="${#lists.isEmpty(parent.getList())}">
                    <li th:each="item:${parent.getList()}">
                        <b th:text="${item.getEntity().getId()}"></b>
                        <b th:text="${item.getEntity().getName()}">男装</b>
                        <span>
<!--                            <i class="add" th:attr="data-id=${item.getEntity().getId()},data-text=${item.getEntity().getName()},data-parent-id=${item.getEntity().getParentId()}">新增</i>-->
                            <i class="delete" th:attr="data-id=${item.getEntity().getId()}">删除</i>
                        </span>
                        <ul th:unless="${#lists.isEmpty(item.getList())}">
                            <li th:each="item1:${item.getList()}">
                                <b th:text="${item1.getEntity().getId()}"></b>
                                <b th:text="${item1.getEntity().getName()}">西装</b>
                                <span>
<!--                                    <i class="add" th:attr="data-id=${item1.getEntity().getId()},data-text=${item1.getEntity().getName()},data-parent-id=${item1.getEntity().getParentId()}">新增</i>-->
                                    <i class="delete" th:attr="data-id=${item1.getEntity().getId()}">删除</i>
                                </span>
                                <ul th:unless="${#lists.isEmpty(item1.getList())}">
                                    <li th:each="item2:${item1.getList()}">
                                        <b th:text="${item2.getEntity().getId()}"></b>
                                        <b th:text="${item2.getEntity().getName()}">商务款</b>
                                        <span>
<!--                                            <i class="add" th:attr="data-id=${item2.getEntity().getId()},data-text=${item2.getEntity().getName()},data-parent-id=${item2.getEntity().getParentId()}">新增</i>-->
                                            <i class="delete" th:attr="data-id=${item2.getEntity().getId()}">删除</i>
                                        </span>
                                        <ul th:unless="${#lists.isEmpty(item2.getList())}">
                                            <li th:each="item3:${item2.getList()}">
                                                <b th:text="${item3.getEntity().getId()}"></b>
                                                <b th:text="${item3.getEntity().getName()}">短款</b>
                                                <span>
                                                    <i class="delete" th:attr="data-id=${item3.getEntity().getId()}">删除</i>
                                                </span>
                                            </li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </dd>
        </dl>
    </div>

    <!-- 模板 新增 -->
    <script type="text/template" id="tpl-1">
        <div class="T-box">
            <p><span>上级分类</span><input id="fl-parent" readonly type="text"/></p>
            <p><span>分类名称</span><input id="fl-name" type="text"/></p>
        </div>
    </script>

    <script type="text/javascript" src="/sb/jquery.min.js"></script>
    <script type="text/javascript" src="/sb/Tips.min.js"></script>
    <script type="text/javascript">
        $(function () {
            // 新增
            $('.add').click(function () {
                var id = $(this).attr('data-id');
                var text = $(this).attr('data-text');
                var parentId = $(this).attr('data-parent-id');
                Tips.alert({
                    title: '新增类别',
                    content: $('#tpl-1').html(),
                    render: function () {
                        $('#fl-parent').val(text);
                    },
                    before: function () {
                        var name = $('#fl-name');
                        if (name.val() == '') {
                            alert("分类名称不能为空");
                            return false;
                        }
                    },
                    define: function () {
                        var name = $('#fl-name');
                        var pname = $('#fl-parent');

                        var dataObj = {
                            "name": name.val(),
                            "pname":pname.val(),
                            "id": id,
                            "parentId": parentId
                        }

                        // ajax处理
                        $.ajax({
                            url: '/ajax_goods/add_goods_category',
                            type: "POST",
                            dataType: 'json',
                            contentType: 'application/json',
                            data: JSON.stringify(dataObj),
                            success: function (res) {
                                Tips.alert(res.msg, function () {
                                    location.reload(true);
                                });
                            },
                            complete: function(XMLHttpRequest){
                                if (XMLHttpRequest.getResponseHeader("REDIRECT")=="NO_ACCESS")alert("无权限访问");
                            },
                        });
                    }
                });
            });

            // 删除
            $('.delete').click(function () {
                var id = $(this).attr('data-id');
                Tips.confirm({
                    title: '删除类别',
                    content: '您确定要删除该类别吗？',
                    define: function () {
                        // ajax处理
                        // .. id
                        // ajax处理
                        $.ajax({
                            url: '/ajax_goods/del_goods_category',
                            type: "POST",
                            dataType: 'json',
                            contentType: 'application/json',
                            data: id,
                            success: function (res) {
                                Tips.alert(res.msg, function () {
                                    location.reload(true);
                                });
                            },
                            complete: function(XMLHttpRequest){
                                if (XMLHttpRequest.getResponseHeader("REDIRECT")=="NO_ACCESS")alert("无权限访问");
                            },
                        });
                    }
                });
            });
        });
    </script>
    <!-- end sp-wrapper -->
</div>
</body>
</html>
